<template>
   <h2>注册</h2>
     <table>
         <tr>
             <td>用户名</td>
             <td><input type="text" v-model="info.username"></td>
         </tr>
         <tr>
             <td>密码</td>
             <td><input type="password" v-model="info.password"></td>
         </tr>
         <tr>
            <td colspan="2" style="text-align: center;">
            <input type="button" value="注册" @click="SaveData"/>
            </td>
         </tr>
     </table>
</template>

<script setup lang="ts">
  import {ref} from 'vue'
  import axios from 'axios'
  import { useRouter} from 'vue-router';
  const route = useRouter();
   const info = ref({
       username:'',
       password:''
   })
   
   const SaveData = ()=>{
    if(info.value.username=='')
       {
           alert('用户名不能为空');
           return;
       }
       if(info.value.password=='')
       {
           alert('密码不能为空');
           return;
       }
       axios({
           url:"https://localhost:44346/api/Users/Register",
           method:"post",
           data:{
               UserName:info.value.username,
               UserPwd:info.value.password
           }
       }).then(function(res){
            if(res.data>0)
            {
                alert('注册成功')
                //跳转到登录页面
                route.push('/')
            }else if(res.data==-1)
            {
                alert('用户名已存在')
            }else
            {
                alert('注册失败')
            }
       }).catch(function(err){
           console.log(err);
       }).finally(function(){
           console.log('请求结束!');
       })
   }
</script>